<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:core="http://www.contact.core.com/contacts/core/ui"
      xmlns:a4j="http://richfaces.org/a4j"
        >

<ui:component>
    <h:form>
        <rich:panel style="width:100%; overflow:auto;" bodyClass="rich-laguna-panel-no-header">

            <h:outputLabel style="color:gray;"
                           value="#{profileSessionBean.information.firstName} only shares certain information with everyone. To learn more about #{profileSessionBean.information.firstName}, ">
                <a4j:commandLink rendered="#{profileSessionBean.information.male}" value="add him as a friend."/>
                 <a4j:commandLink rendered="#{not profileSessionBean.information.male}" value="add her as a friend."/>
            </h:outputLabel>
        </rich:panel>
        <br/>
        <a4j:outputPanel rendered="#{not empty viewFriendBean.allMutualFriends}" layout="block" style="width:100%">
            <h:outputLabel value="#{resources.mutualFriendsLabel}"/>
            <a4j:outputPanel layout="block" style="width:100%">

                <rich:separator height="1px" width="100%"/>
                <a4j:outputPanel style="float:right">
                    <a4j:commandLink value="#{resources.seeAllLabel} (#{viewFriendBean.allFriendsCount})"
                                     action="#{viewFriendBean.prepareForViewMutualFriends}"
                                     reRender="someoneFriendViewPanel"
                                     oncomplete="Richfaces.showModalPanel('someoneFriendViewPanel');"
                                     limitToList="true">

                        <f:setPropertyActionListener value="#{profileSessionBean.information.id}"
                                                     target="#{viewFriendBean.informationId}"/>
                    </a4j:commandLink>
                </a4j:outputPanel>

            </a4j:outputPanel>
            <core:mutalFriendsDataGrid columns="6" element="6"  style="resize:both; width: 60px;"/>
            <!--<rich:dataGrid-->
                    <!--columns="#{viewFriendBean.allMutualFriendsCount lt 6 ? viewFriendBean.allMutualFriendsCount : 6}"-->
                    <!--value="#{viewFriendBean.allMutualFriends}" elements="6"-->
                    <!--var="friend" rowKeyVar="row">-->
                <!--<core:pictureForViewWithName columns="1"-->
                                             <!--fullName="#{friend.firstName} #{friend.lastName}"-->
                                             <!--style="resize:both; width: 60px;"-->
                                             <!--informationId="#{friend.id}"/>-->
            <!--</rich:dataGrid>-->

        </a4j:outputPanel>
        <br/>
        <a4j:outputPanel rendered="#{not empty viewFriendBean.allFriends}" layout="block" style="width:100%">
            <h:outputLabel value="#{resources.allFriendsLabel}"/>
            <a4j:outputPanel layout="block" style="width:100%">

                <rich:separator height="1px" width="100%"/>
                <a4j:outputPanel style="float:right">
                    <a4j:commandLink value="#{resources.seeAllLabel} (#{viewFriendBean.allFriendsCount})"
                                     action="#{viewFriendBean.prepareForViewAllFriends}"
                                     reRender="someoneFriendViewPanel"
                                     oncomplete="Richfaces.showModalPanel('someoneFriendViewPanel');"
                                     limitToList="true">

                        <f:setPropertyActionListener value="#{profileSessionBean.information.id}"
                                                     target="#{viewFriendBean.informationId}"/>
                    </a4j:commandLink>
                </a4j:outputPanel>

            </a4j:outputPanel>
            <!--<rich:dataGrid columns="#{viewFriendBean.allFriendsCount lt 6 ? viewFriendBean.allMutualFriendsCount : 6}"-->
                           <!--value="#{viewFriendBean.allFriends}" elements="6"-->
                           <!--var="friend" rowKeyVar="row">-->
                <!--<core:pictureForViewWithName columns="1"-->
                                             <!--fullName="#{friend.firstName} #{friend.lastName}"-->
                                             <!--style="resize:both; width: 60px;"-->
                                             <!--informationId="#{friend.id}"/>-->
            <!--</rich:dataGrid>-->
            <core:allFriendsDataGrid  columns="6" element="6"  style="resize:both; width: 60px;"/>
        </a4j:outputPanel>
    </h:form>
</ui:component>


</html>
